Skip to content

Migrate examples to latest Meteor 3.4#42

Open
nachocodoner wants to merge 79 commits intomainfrom
migrate-examples
Open

Migrate examples to latest Meteor 3.4#42
nachocodoner wants to merge 79 commits intomainfrom
migrate-examples

Conversation

@nachocodoner
Copy link
Copy Markdown
Member

@nachocodoner nachocodoner commented Mar 11, 2026

This PR migrates existing apps in this repo to latest Meteor 3.4.

Task Manager (formerly Tailwind CSS)

  • Migrate Tailwind CSS example app from Meteor 2.8 to Meteor 3.4 with Rspack bundler
  • Replace juliancwirko:postcss Meteor build plugin with Rspack's built-in CSS/PostCSS pipeline
  • Upgrade Tailwind CSS from v2 to v3
  • Replace Meteor-specific .postcssrc.js with standard postcss.config.js
  • Update React rendering from legacy render() to React 18 createRoot API
  • Upgrade all npm dependencies to latest versions
  • Revamped from a static Tailwind CSS demo into a dynamic task management app
  • Added MongoDB collection (tasks) with full CRUD operations (create, update, delete)
  • Integrated Meteor-RPC for type-safe methods and publications with Zod schema validation
  • Integrated shadcn/ui components (manually installed: Button, Input, Badge, Card, Table, Dialog, Select, DropdownMenu, Label)
  • Added React Query via Meteor-RPC hooks (usePublication, useMutation) for reactive data fetching
  • Replaced static hardcoded data with reactive dashboard metrics and a filterable task table
  • Configured Tailwind CSS with CSS custom properties for shadcn/ui theming
image

Notes Offline (formerly Chakra UI)

  • Replaced static Chakra UI demo with a functional offline-first notes app
  • Removed Chakra UI / Emotion / Framer Motion; replaced with Mantine UI + PostCSS (Chakra UI already demostrated in a skeleton using meteor create)
  • Integrated jam:offline for IndexedDB persistence and auto-sync
  • Integrated jam:method for optimistic methods with offline queuing
  • Integrated jam:pub-sub with global subscription caching
  • Integrated jam:soft-delete for recoverable deletion with trash UI
  • Integrated Workbox via workbox-webpack-plugin + Rspack for PWA service worker
  • Full CRUD with auto-save, search, tags, pin, Markdown preview, export/import, dark mode, keyboard shortcuts
image

Parties

  • Migrate Parties example app from Meteor 2.3.5 to Meteor 3.4 with Rspack bundler
  • Convert all server-side MongoDB operations to async (insertAsync, findOneAsync, updateAsync) while keeping client-side minimongo calls synchronous for Tracker reactivity
  • Fix publication arrow functions to use regular functions for correct this.userId binding
  • Remove accounts-facebook and accounts-twitter (TODO: research its inclusion)
  • Upgrade Blaze to v3 (backward-compatible)
  • Restyled with latest Bootstrap update
image

Tic-Tac-Toe

  • Migrate Tic-Tac-Toe example app from Meteor 3.0-beta.6 to Meteor 3.4 with Rspack bundler
  • Remove all beta version pins from Atmosphere packages to resolve stable 3.4 versions
  • Add "modern": true flag to enable ES2020+ module output required by Rspack
  • Update React rendering from legacy render() to React 19 createRoot API
  • Restyle entire UI with MUI (Material UI) v7 for a polished, user-friendly look
image

Complex Todos (Svelte)

  • Migrate Complex Todos Svelte example app from Meteor 2 to Meteor 3.4 with Rspack bundler
  • Replace mdg:validated-method + simpl-schema with jam:method + Zod for method definitions and schema validation
  • Update Svelte mounting to use mount()/unmount() API with HMR support
  • Convert all server-side MongoDB operations to async (insertAsync, findOneAsync, updateAsync)
  • Upgrade all npm dependencies to latest versions, including Svelte 5
  • Replaced Bootstrap 5 (CDN) with Skeleton UI v4 + Tailwind CSS v4, using the Cerberus theme
  • Migrated all components from Svelte 4 syntax (export let, $:, on:click) to Svelte 5 runes ($props, $state, $derived, onclick)
  • Moved login/register from inline navbar form to a Skeleton Dialog modal
image

NFT Marketplace

  • Migrate NFT Marketplace example app from Meteor 2.7.2 to Meteor 3.4 with Rspack bundler
  • Update React rendering from legacy render() to React 18+ createRoot API
  • Upgrade all npm dependencies to latest versions, including React 18 and Hardhat 2.22+

Simple Blog (Contribution)

image
  • Restyle the Parties, TicTacToe, ComplesTodos app to showcase using other UI interesting libraries
  • Add test and lint tools to complete the example's experience
  • Ensure tests are running across the apps that describes them
  • Ensure apply to Meteor 3.4.1 core a fix to automatically favor Rspack css pipelines if css imports are detected, [Rspack] Enable automatic CSS delegation to Rspack meteor#14257
  • CopySWToPublic to the core for when sw is available and generated?, [Rspack] Serve sw.js files as part of development (HMR) meteor#14255
  • Rework Meteor core CLI to automatically read examples available and clone them effectively with just meteor create (revisit already approach)
  • Deploy all apps within this repository and update readme.md

[More coming]

…actor methods to async/await, update build configuration, and clean unused files
…into a detailed offline-first notes app with new stack integration (jam packages, Mantine UI) and features (PWA, Markdown support, tagging, etc.).
…update service worker options for improved caching and navigation handling.
…reen.jsx` using `useEffect`.

- Add clickable home link to AppBar in `Layout.jsx`.
- Enhance MUI theme with detailed palette, typography, and component overrides in `theme.js`.
- Customize Mantine theme with updated primary color, font sizes, default radius, and component-specific styles.
- Refine `NoteEditor` component by simplifying `Text` visibility logic in dropdown items.
Adds an ownerId to every note so multiple visitors of the deployed demo
do not share a single collection. The id is generated client-side and
stored in localStorage; all publications and methods accept and enforce
it. An EmptyState hint now surfaces the local-only nature of storage
and points users to the existing Export action for backups.

Includes server-side ownership tests (cross-owner update, remove, and
emptyTrash isolation) and a Playwright test that two browser contexts
with different ownerIds do not see each other's notes.

Also removes em dash characters from comments and strings in this
package for consistency.
Integrates Lingui into the build pipeline in two complementary ways:
@lingui/swc-plugin is registered in .swcrc so the t, Trans, and Plural
macros are transformed by Meteor's built-in SWC loader, and @lingui/loader
compiles the JSON source catalogs inline during bundling so no precompile
step or committed .mjs artifacts are needed.

Catalogs live as minimal flat JSON under imports/locales/{en,es,pt}. The
initial locale comes from localStorage, then navigator.language, falling
back to English. A language switcher in the header menu writes the choice
to localStorage. All user-facing strings in App, NotesList, NoteEditor,
and EmptyState are wrapped in Lingui macros, including a Plural for the
note counter. Dates go through i18n.date so locale affects formatting.

Adds an i18n:extract npm script, a Playwright test that switches to
Spanish and asserts translated strings appear and the locale persists,
and README sections in both the root index and the notes-offline package
covering setup, macro usage, and the extract workflow.
Meteor's DDP heartbeat can take 15s or more to notice a dropped
connection, so the icon used to lag noticeably behind reality. Combine
navigator.onLine (via window online/offline events) with
Meteor.status().connected so the icon reacts immediately when the
browser reports offline, while still catching server-only outages
through Meteor's heartbeat.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant